@import '../../style/color.scss';
@import '../../style/font.scss';

$btn-font-family: "PingFang SC Regular";

button {
  font-family: $btn-font-family;
  border-radius: 4px;
  border-width: 0;
  outline: 0;
  -webkit-appearance: none;
}

// 确定按钮
button.confirm-btn {
  background-color: #8FD57D;
  color: $white-text-color;
  line-height: 1em;

  &:active {
    background-color: #8FD57D;
    color: $white-text-color;
  }
}

button.confirm-btn.large {
  width: 670px;
  height: 96px;
  @include font-dpr(30px);
}

button.confirm-btn.default:disabled {
  background-color: $disabled-btn-background-color;
}

button.confirm-btn.default {
  width: 310px;
  height: 96px;
  @include font-dpr(28px);
}

// 普通的按钮 - 红色
button.normal-btn {
  background-color: $main-red-color;
  color: #ffffff;
  border: 1px solid $main-red-color;
  line-height: 1em;

  &:active {
    background-color: #FFE9E9;
    color: $main-red-color;
  }
}

button.normal-btn.default {
  width: 180px;
  height: 60px;
  @include font-dpr(28px);
}

// 谨慎操作按钮 (删除...)
button.cautious-btn {
  background-color: $white-text-color;
  color: $assist-text-color;
  border: 1px solid $normal-btn-color;
  line-height: 1em;

  &:active {
    //TODO 背景色待确定
    background-color: #E8E8E8;
    color: $assist-text-color;
  }
}

button.cautious-btn.large {
  width: 310px;
  height: 96px;
  @include font-dpr(28px);
}

button.cautious-btn.default {
  width: 180px;
  height: 60px;
  @include font-dpr(28px);
}

button.inline-btn {
  width: 214px;
  height: 100px;
  background-color: $main-red-color;
  color: $white-text-color;
  border-radius: 0;
  @include font-dpr(30px);
  line-height: 30px;

  &:active {
    background-color: $red-hover-color;
    color: $white-text-color;
  }

  &:disabled {
    background-color: $disabled-btn-background-color;
    color: #FFF;
    border: none;
  }
}

.button-delay{
  color: red;
}
